<template>
  <a-spin :spinning="confirmLoading">
    <a-row class="top-row">
        <a-col :lg="3" :md="12" :sm="21">
          <a-form-item :colon="false" label="报废单号">
            {{ model.scrapNo }}
          </a-form-item>
        </a-col>
      <a-col :lg="3" :md="12" :sm="21">
        <a-form-item :colon="false" label="设备名称">
          {{ model.deviceId_dictText }}
        </a-form-item>
      </a-col>
      <a-col :lg="3" :md="12" :sm="21">
        <a-form-item :colon="false" label="创建人">
          {{ model.createBy_dictText }}
        </a-form-item>
      </a-col>
      <a-col :lg="3" :md="12" :sm="21">
        <a-form-item :colon="false" label="报废原因">
          {{ model.scrapReason }}
        </a-form-item>
      </a-col>
      <a-col :lg="3" :md="12" :sm="21">
        <a-form-item :colon="false" label="提报时间">
          {{ model.subTime }}
        </a-form-item>
      </a-col>
    </a-row>
    <a-row>
      <a-col :lg="3" :md="12" :sm="21">
        <a-form-item :colon="false" label="设备图片">
          <img :src="imageUrl" alt="" style="width: 120px; height: 100px" @click="previewImage" />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row>
      <a-col>
        <a-form-item :colon="false" label="审批意见">
          <a-textarea v-model="model.approvDescribe"></a-textarea>
        </a-form-item>
      </a-col>
    </a-row>

  </a-spin>
</template>

<script>
import {getAction, httpAction, postAction} from "@api/manage";

export default {
  name: "EneDeviceApprovalForm",
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      approvDescribe:"",
      model: {},

      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      url: {
        auditing:'/test/EneDeviceScrap/auditing'
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
    imageUrl() {
      return `http://${window.location.host}/tsl-boot/sys/common/static/${this.model.deviceImages}`;
    }
  },
  created() {


  },
  mounted() {

  },
  methods: {
    submitForm(status){
      const that = this;
      // 触发表单验证
        this.model.status=status
          that.confirmLoading = true

          postAction(this.url.auditing,this.model).then(res => {
            if(res.success){
              that.$message.success(res.message);
              that.$emit('ok');
            }else{
              that.$message.warning(res.message);
            }
          }).finally(e=>{
            that.confirmLoading = false
          })
    },

    check(record) {
      this.model = Object.assign({}, record)
      this.visible = true
    },
    previewImage(event) {
      window.open(this.imageUrl, '_blank');
    }
  }
}
</script>

<style scoped>
.top-row {
  background: #F4F5F7;
  padding: 12px 24px;

}

.top-row /deep/ .ant-form-item {
  margin-bottom: 0;
  color: #6B778C
}

.top-row /deep/ .ant-form-item-label {
  line-height: 1;
}

.top-row /deep/ .ant-form-item-control {
  line-height: 1;
  margin-top: 10px;
}

.top-row /deep/ .ant-form-item-label > label {
  color: #6B778C
}
</style>